<template>
  <van-tabs v-model:active="active" animated>
    <van-tab title="全部">
      <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
      <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" @click="dianji"/>
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
    </van-tab>
    <van-tab title="待付款">
      <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
      <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
    </van-tab>
    <van-tab title="待发货">
      <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
      <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
    </van-tab>
    <van-tab title="待收货">
      <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
      <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
    </van-tab>
    <van-tab title="已完成">
      <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
      <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
    </van-tab>
    <van-tab title="已取消">
      <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
      <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
        <div style="display: flex; margin-top: 10px;"><span>2024-06-18 15:04:26</span><van-count-down :time="time"
          style="margin-left: 160px;" /></div>
        <van-card num="3" price="￥20.10" desc="描述信息" title="华为Mate60Pro"
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
    </van-tab>
  </van-tabs>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
const time = ref(30 * 60 * 60 * 1000);
let router=useRouter()
let dianji=()=>{
  router.push('/order')
}
</script>

<style lang="scss" scoped></style>